<template>
 <div style="width: 100vw;height: 100vh;padding-left: 50vw;padding-top: 50vh;">
  <div style="width: 450px;height: 500px;transform: translate(-50%,-50%);border: 1px solid var(--color-neutral-3);border-radius: 10px;padding: 48px 40px 36px;text-align: center;overflow: hidden;">
    <v-progress-linear v-if="data.loginForm.loading" style="width: 100%;position: absolute;top: 0;color: var(--color-neutral-10);" indeterminate></v-progress-linear>
    <div v-if="data.loginForm.loading" style="width: 100%;height: 100%;position: absolute;background-color: var(--color-neutral-1);z-index: 5000;left: 0;top: 0;opacity: 0.2"></div>
    <div v-if="data.loginForm.currentPage==0" class="登录窗口">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'注册' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">{{ data.loginForm.subTitle }}</p>
      <div style="width: 100%;margin-top: 24px;position: relative;">
        <v-text-field v-model="data.loginForm.loginEmail" variant="outlined" label="电子邮件地址" style="color: var(--color-neutral-10);"></v-text-field>
        <v-text-field v-model="data.loginForm.loginPassword" type="password" variant="outlined" label="登录密码" style="color: var(--color-neutral-10);"></v-text-field>
        <p v-if="data.loginForm.loginWarningText!=''" style="color: red;text-align: left;margin-bottom: 5px;">{{ data.loginForm.loginWarningText }}</p>
      </div>
      <!-- <a-link style="background-color: var(--color-neutral-1);color: var(--color-neutral-10);padding: 0 0;float: left;margin-right: 10px;">咨询师登录</a-link> -->
      <a-link style="background-color: var(--color-neutral-1);color: var(--color-neutral-10);padding: 0 0;float: left;" @click="backToHomePage">暂不登录</a-link>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;" @click="login"
      >登录</v-btn>
      <v-btn variant="text" style="position: absolute;left: 30px;bottom: 64px;background-color: var(--color-neutral-1);padding: 0 10px;"
        :style="{
          color:appData.isDarkMode?'white':'rgb(0,120,215)'
        }"
             @click="changeToRegisterPage"
      >创建账号</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==1" class="注册窗口-输入邮箱">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">{{ data.loginForm.subTitle }}</p>
      <div style="width: 100%;margin-top: 24px;position: relative;">
        <v-text-field v-model="data.loginForm.register.email" variant="outlined" label="电子邮件地址" style="color: var(--color-neutral-10);"></v-text-field>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
             @click="registerChangeToNextPage_inputName"
      >下一步</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==2" class="注册窗口-输入姓名">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">{{ data.loginForm.subTitle }}</p>
      <div style="width: 100%;margin-top: 24px;position: relative;">
        <v-text-field v-model="data.loginForm.register.name" variant="outlined" label="姓名" style="color: var(--color-neutral-10);"></v-text-field>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
             @click="registerChangeToNextPage_selectProvince"
      >下一步</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==3" class="注册窗口-选择高考省份">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">请选择高考省份</p>
      <div style="width: 100%;margin-top: 24px;position: relative;">
        <v-select style="color: var(--color-neutral-10);" variant="outlined" :items="data.loginForm.provinceNameStringArray" label="省份" v-model="data.loginForm.register.province"></v-select>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
             @click="registerChangeToNextPage_selectSubjectType"
      >下一步</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==4" class="注册窗口-选择选科类型">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">请选择选科类型</p>
      <div style="width: 100%;margin-top: 24px;position: relative;">
        <v-select style="color: var(--color-neutral-10);" :items="data.loginForm.subjectTypes" variant="outlined" label="选科" v-model="data.loginForm.register.subjectType"></v-select>
        <div v-if="data.loginForm.register.subjectType!='' && data.loginForm.register.subjectType!='文科' && data.loginForm.register.subjectType!='理科'" style="color: var(--color-neutral-10);padding: 10px 10px;border-radius: 10px;background-color: var(--color-neutral-2);text-align: left;margin-bottom: 13px">
          <p style="font-weight: bold;margin-bottom: 5px">请选择你的科目</p>
          <a-checkbox-group v-model="data.loginForm.register.subjectsSelect">
            <a-checkbox :value="item.key" style="width: 50%;margin: 0 0;display: inline-block" v-for="item in [
                {
                  name:'物理',
                  key:'wl'
                },
                {
                  name:'化学',
                  key:'hx'
                },
                {
                  name:'生物',
                  key:'sw'
                },
                {
                  name:'政治',
                  key:'zz'
                },
                {
                  name:'历史',
                  key:'lz'
                },
                {
                  name:'地理',
                  key:'dl'
                },
            ]" :style="{
              display:getStudentChooseSubjects(item.name)?'unset':'none'
            }">{{item.name}}</a-checkbox>
          </a-checkbox-group>
        </div>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
             @click="registerChangeToNextPage_inputScoreAndRanking"
      >下一步</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==5" class="注册窗口-输入成绩">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">请输入高考成绩</p>
      <div style="width: 100%;margin-top: 24px;position: relative;">
        <v-text-field style="color: var(--color-neutral-10);" v-model="data.loginForm.register.score" label="分数" variant="outlined"></v-text-field>
        <v-text-field style="color: var(--color-neutral-10);" v-model="data.loginForm.register.ranks" label="位次" variant="outlined"></v-text-field>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
            @click="registerChangeToNextPage_selectSMSR"
      >下一步</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==6" class="注册窗口-选择身体受限情况">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">您是否有身体受限情况</p>
      <div style="width: 100%;margin-top: 24px;position: relative;text-align: left;font-size: 22px;">
        <a-checkbox v-model="data.loginForm.register.isSM">色盲</a-checkbox><br>
        <a-checkbox v-model="data.loginForm.register.isSR">色弱</a-checkbox>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
            @click="registerChangeToNextPage_setPassword"
      >下一步</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==7" class="注册窗口-设置登录密码">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">设置登录密码</p>
      <div style="width: 100%;margin-top: 24px;position: relative;text-align: left;font-size: 22px;color: var(--color-neutral-10);">
        <v-text-field v-model="data.loginForm.register.password" type="password" variant="outlined" label="密码"></v-text-field>
        <v-text-field v-model="data.loginForm.register.rePassword" type="password" variant="outlined" label="重复密码"></v-text-field>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
            @click="finishRegister"
      >完成注册</v-btn>
    </div>

    <div v-if="data.loginForm.currentPage==8" class="注册窗口-完成注册窗口">
      <p style="font-size: 20px;color: var(--color-neutral-5);">志愿助手</p>
      <p style="margin-top: 16px;font-size: 24px;color: var(--color-neutral-10);">{{ data.loginForm.currentPage==0?'登录':'创建账号' }}</p>
      <p style="margin-top: 7px;color: var(--color-neutral-10);">{{ data.loginForm.subTitle }}</p>
      <div style="width: 100%;margin-top: 24px;position: relative;text-align: left;color: var(--color-neutral-10);">
        <p>{{ data.loginForm.finishRegContent }}</p>
        <p v-if="data.loginForm.register.warningText!=''" style="color: red;text-align: left;transform: translateY(-10px);font-size: 14px">{{ data.loginForm.register.warningText }}</p>
      </div>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
            @click="login(true)"
            v-if="data.loginForm.subTitle=='注册成功'"
      >登录</v-btn>
      <v-btn style="position: absolute;right: 40px;bottom: 64px;background-color: rgb(0,120,215);color: white;"
            @click="()=>{
              data.loginForm.register = JSON.parse(JSON.stringify(data.loginForm.registerFormNew))
              data.loginForm.currentPage = 1
              data.loginForm.subTitle = '请输入电子邮件地址'
            }"
            v-if="data.loginForm.subTitle!='注册成功'"
      >重新注册</v-btn>
    </div>

  </div>
 </div>
</template>

<script>
import config from '@/config'
import router from '@/router'
import tool from '@/utlis/tool'
import axios from 'axios'
import { sha256 } from 'js-sha256'

export default{
  computed:{

  },
  data(){
    return{
      data:{
        loginForm:{
          currentPage:0,
          subTitle:'以考生身份登录',
          loading:false,
          provinceSubjects:[],
          provinceNameStringArray:[],
          subjectTypes:[],
          finishRegContent:'',
          register:{
            email:'',
            name:'',
            province:'',
            subjectType:'',
            ranks:'',
            score:'',
            isSM:false,
            isSR:false,
            password:'',
            rePassword:'',
            warningText:'',
            type:0,
            subjects:{
              wl:false,
              hx:false,
              sw:false,
              zz:false,
              ls:false,
              dl:false
            },
            subjectsSelect:[]
          },
          loginEmail:'',
          loginPassword:'',
          loginWarningText:'',
          registerFormNew:{
            email:'',
            name:'',
            province:'',
            subjectType:'',
            ranks:'',
            score:'',
            isSM:false,
            isSR:false,
            password:'',
            rePassword:'',
            warningText:'',
            type:0,
            subjects:{
              wl:false,
              hx:false,
              sw:false,
              zz:false,
              ls:false,
              dl:false
            },
            subjectsSelect:[]
          },
        }
      }
    }
  },
  mounted(){
    this.controlAppLoading()
  },
  methods:{
    getStudentChooseSubjects(name){
      switch (this.data.loginForm.register.subjectType.slice(0,2)) {
        case '综合':
          return true
        case '本科':
          return true
        case '专科':
          return true
        case '物理':
          if(name=='物理'){
            return false
          }
          if(name=='历史'){
            return false
          }
          return true
        case '历史':
          if(name=='物理'){
            return false
          }
          if(name=='历史'){
            return false
          }
          return true
        case '理科':
          return false
        case '文科':
          return false
      }
    },
    async login(loginAfterReg){
      this.data.loginForm.loginWarningText = ''
      if(loginAfterReg==true){
        this.data.loginForm.loginEmail = this.data.loginForm.register.email
        this.data.loginForm.loginPassword = this.data.loginForm.register.password
      }
      if(this.data.loginForm.loginEmail==''){
        this.data.loginForm.loginWarningText = '请输入登录邮箱'
        return
      }
      if(this.data.loginForm.loginPassword==''){
        this.data.loginForm.loginWarningText = '请输入登录密码'
        return
      }
      this.data.loginForm.loading = true
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/user/login',{
        email:this.data.loginForm.loginEmail,
        password:sha256(this.data.loginForm.loginPassword)
      })
      this.data.loginForm.loading = false
      if(re.status!=1){
        this.data.loginForm.loginWarningText = re.content
        return
      }
      if(re.status==1){
        localStorage.setItem('loginedUserInfo',JSON.stringify(re.results.userInfo))
        router.push('/')
      }
    },
    async registerChangeToNextPage_setPassword(){
      this.data.loginForm.register.warningText = ''
      this.data.loginForm.loading = true
      await this.waitSeconds(1.5)
      this.data.loginForm.loading = false
      this.data.loginForm.currentPage = 7
    },
    async finishRegister(){
      this.data.loginForm.register.warningText = ''
      if(tool.isVaildPasswordString(this.data.loginForm.register.password)==false){
        this.data.loginForm.register.warningText = '密码应由大小写字母、数字或下划线组成，长度不小于8位且不长于16位'
        return
      }
      if(this.data.loginForm.register.password!=this.data.loginForm.register.rePassword){
        this.data.loginForm.register.warningText = '两次输入的密码不一致'
        return
      }
      this.data.loginForm.loading = true
      await this.waitSeconds(1.5)
      this.data.loginForm.register.isSM = this.data.loginForm.register.isSM?1:0
      this.data.loginForm.register.isSR = this.data.loginForm.register.isSR?1:0
      this.data.loginForm.register.score = parseInt(this.data.loginForm.register.score)
      this.data.loginForm.register.ranks = parseInt(this.data.loginForm.register.ranks)
      this.data.loginForm.register.subjects = JSON.stringify(this.data.loginForm.register.subjects)
      this.data.loginForm.register.allowChatUserEmails = JSON.stringify([])
      this.data.loginForm.register.type = 0
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/user/register',this.data.loginForm.register)
      if(re.status!=1){
        this.data.loginForm.subTitle = '注册失败'
        this.data.loginForm.finishRegContent = '很抱歉，注册失败，原因：' + re.content
      }else{
        this.data.loginForm.subTitle = '注册成功'
        this.data.loginForm.finishRegContent = '恭喜您，注册成功，登录账号是您的邮箱，请牢记您的登录密码'
      }
      this.data.loginForm.loading = false
      this.data.loginForm.currentPage = 8
    },
    async registerChangeToNextPage_selectSMSR(){
      this.data.loginForm.register.warningText = ''
      if(this.data.loginForm.register.score==''){
        this.data.loginForm.register.warningText = '请输入成绩'
        return
      }
      if(this.data.loginForm.register.ranks==''){
        this.data.loginForm.register.warningText = '请输入位次'
        return
      }
      if(isNaN(parseInt(this.data.loginForm.register.score))){
        this.data.loginForm.register.warningText = '请输入正确的成绩'
        return
      }
      if(isNaN(parseInt(this.data.loginForm.register.ranks))){
        this.data.loginForm.register.warningText = '请输入正确的位次'
        return
      }
      if(parseInt(this.data.loginForm.register.score)<0 || parseInt(this.data.loginForm.register.score)>750){
        this.data.loginForm.register.warningText = '请输入正确的成绩'
        return
      }
      if(parseInt(this.data.loginForm.register.ranks)<0){
        this.data.loginForm.register.warningText = '请输入正确的位次'
        return
      }
      this.data.loginForm.loading = true
      await this.waitSeconds(1.5)
      this.data.loginForm.loading = false
      this.data.loginForm.currentPage = 6
    },
    async registerChangeToNextPage_inputScoreAndRanking(){
      this.data.loginForm.register.warningText = ''
      if(this.data.loginForm.register.subjectType==''){
        this.data.loginForm.register.warningText = '请选择选科类型'
        return
      }
      this.data.loginForm.register.subjects = {
        wl:false,
        hx:false,
        sw:false,
        zz:false,
        ls:false,
        dl:false
      }
      for(let i=0;i<this.data.loginForm.register.subjectsSelect.length;i++){
        this.data.loginForm.register.subjects[this.data.loginForm.register.subjectsSelect[i]] = true
      }
      let currentSubjectType = this.data.loginForm.register.subjectType
      let num = this.data.loginForm.register.subjectsSelect.length
      if(currentSubjectType=='综合' || currentSubjectType=='本科' || currentSubjectType=='专科'){
        if(num!=3){
          this.data.loginForm.register.warningText = '请选择3个科目'
          return
        }
      }
      if(currentSubjectType=='物理类' || currentSubjectType=='历史类'){
        if(num!=2){
          this.data.loginForm.register.warningText = '请选择2个科目'
          return
        }
      }
      if(currentSubjectType=='理科'){
        this.data.loginForm.register.subjects.wl = true
        this.data.loginForm.register.subjects.hx = true
        this.data.loginForm.register.subjects.sw = true
      }
      if(currentSubjectType=='文科'){
        this.data.loginForm.register.subjects.wl = true
        this.data.loginForm.register.subjects.hx = true
        this.data.loginForm.register.subjects.sw = true
      }
      if(currentSubjectType=='物理类'){
        this.data.loginForm.register.subjects.wl = true
      }
      if(currentSubjectType=='历史类'){
        this.data.loginForm.register.subjects.ls = true
      }
      this.data.loginForm.loading = true
      await this.waitSeconds(1.5)
      this.data.loginForm.loading = false
      this.data.loginForm.currentPage = 5
    },
    async registerChangeToNextPage_selectSubjectType(){
      this.data.loginForm.register.warningText = ''
      this.data.loginForm.loading = true
      if(this.data.loginForm.register.province==''){
        this.data.loginForm.loading = false
        this.data.loginForm.register.warningText = '请选择高考省份'
        return
      }
      await this.waitSeconds(1.5)
      let psa = []
      for(let i=0;i<this.data.loginForm.provinceSubjects.length;i++){
        if(this.data.loginForm.provinceSubjects[i].name==this.data.loginForm.register.province){
          for(let i1=0;i1<this.data.loginForm.provinceSubjects[i].type.length;i1++){
            psa.push(this.data.loginForm.provinceSubjects[i].type[i1].name)
          }
        }
      }
      this.data.loginForm.subjectTypes = psa
      this.data.loginForm.loading = false
      this.data.loginForm.currentPage = 4
    },
    async registerChangeToNextPage_selectProvince(){
      this.data.loginForm.register.warningText = ''
      this.data.loginForm.loading = true
      if(this.data.loginForm.register.name==''){
        this.data.loginForm.loading = false
        this.data.loginForm.register.warningText = '请输入姓名'
        return
      }
      await this.waitSeconds(1.5)
      let re = await tool.axiosPostWithCheckStatus(this.appData.serverURL,'/provincesAndSubjects',{})
      let psa = []
      for(let i=0;i<re.results.length;i++){
        psa.push(re.results[i].name)
      }
      this.data.loginForm.provinceNameStringArray = psa
      this.data.loginForm.provinceSubjects = re.results
      this.data.loginForm.loading = false
      this.data.loginForm.currentPage = 3
    },
    backToHomePage(){
      router.push('/')
    },
    async registerChangeToNextPage_inputName(){
      this.data.loginForm.register.warningText = ''
      this.data.loginForm.loading = true
      await this.waitSeconds(0.5)
      if(tool.isRightEmailAddress(this.data.loginForm.register.email)==false){
        this.data.loginForm.register.warningText = '邮箱格式不正确'
        this.data.loginForm.loading = false
        return
      }
      await this.waitSeconds(1.5)
      let re = await tool.axiosPost(this.appData.serverURL,'/user/isExist',{
        email:this.data.loginForm.register.email
      })
      this.data.loginForm.loading = false
      if(re.status!=1){
        this.data.loginForm.register.warningText = '此邮箱已注册'
      }else{
        this.data.loginForm.subTitle = '请输入您的姓名'
        this.data.loginForm.currentPage = 2
      }
    },
    async changeToRegisterPage(){
      this.data.loginForm.loading = true
      await this.waitSeconds(2)
      this.data.loginForm.loading = false
      this.data.loginForm.subTitle = '请输入您的电子邮件地址'
      this.data.loginForm.register = this.resetAllKeys(this.data.loginForm.register)
      this.data.loginForm.currentPage = 1
    },
    waitSeconds(n){
      return new Promise((resolve, reject) => {
        setTimeout(()=>{
          return resolve()
        },n*1000)
      })
    },
    resetAllKeys(jsonObject){
      for(let i=0;i<Object.keys(jsonObject).length;i++){
        jsonObject[Object.keys(jsonObject)[i]] = ''
      }
      return jsonObject
    },
    isRightEmailAddress(string){
        if(isIncludeSpace(string)){
            return false
        }
        if(isAStringOfUppercaseAndLowercaseLettersAndNumbers(string)==false){
            return false
        }
        string = string.split('@')
        if(string.length!=2){
            return false
        }
        if(string[0]=='' || string[1]==''){
            return false
        }
        return true
    },
    axiosGet(url,data){
      return new Promise((resolve, reject) => {
        data = tool.encodeString(JSON.stringify(data));
        var config = {
           method: 'get',
           url: this.appData.serverURL + url,
           data : data
        };
        axios(config)
        .then((res) => {
          return resolve(JSON.parse(tool.decodeString(res.data)))
        })
      })
    },
  },
  props:{
    appData:undefined,
    controlAppLoading:undefined
  },
}

function isAStringOfUppercaseAndLowercaseLettersAndNumbers(string){
    string = string.split('')
    for(let i=0;i<string.length;i++){
        let chcode = string[i].charCodeAt(0)
        if(chcode>=48 && chcode<=57){
            continue
        }
        if(chcode>=65 && chcode<=90){
            continue
        }
        if(chcode>=97 && chcode<=122){
            continue
        }
        if(chcode==43 || chcode==45 || chcode==46){
            continue
        }
        return false
    }
    return true
}

function isIncludeSpace(string){
    string = string.split('')
    for(let i=0;i<string.length;i++){
        if(string[i]==' '){
            return true
        }
    }
    return false
}
</script>

<style scoped>

</style>